<script setup>
import { useI18nStore } from '@/stores/index.js';
const i18nStore = useI18nStore();
</script>

<template>
  <div class="overflow-x-hidden">
    <!-- 头部导航 -->
    <div class="auto pc:max-w-[1200px] mobile:text-4xl mobile:px-10">
      <Nav />
    </div>
    <div class="container mx-auto mobile:px-10 pc:max-w-[800px]">
      <h1 class="text-3xl font-bold my-10">
        {{ i18nStore.translate('costumbre89') }}
      </h1>
      <h3 class="text-xl font-bold mb-5">
        {{ i18nStore.translate('costumbre90') }}
      </h3>
      <p v-for="item in 252" class="my-5 text-lg">
        {{ i18nStore.translate(`costumbre${item + 91}`) }}
      </p>
      <h3 class="text-xl font-bold mb-48">
        {{ i18nStore.translate('costumbre23') }}
      </h3>
    </div>
    <!-- 底部栏 -->
    <div class="foot auto md:max-w-[1200px] mobile:px-10">
      <Foot />
    </div>
  </div>
</template>

<style scoped></style>
